<!DOCTYPE html>
<title>Test visibiblity of controls when focusing video.</title>
<script src="../resources/testharness.js"></script>
<script src="../resources/testharnessreport.js"></script>
<script src="media-controls.js"></script>
<video controls autoplay></video>
<script>
async_test(function(t) {
    var video = document.querySelector("video");

    video.onplaying = t.step_func(function() {
        runAfterHideMediaControlsTimerFired(t.step_func_done(function() {
            var controls = mediaControlsButton(video, "panel");
            assert_true(controls.classList.contains("transparent"));
            video.focus();
            assert_false(controls.classList.contains("transparent"));

            // We fade out when focus is lost, so the opacity is still 1
            video.blur();
            assert_false(controls.classList.contains("transparent"));
        }), video);
    });

    video.src = "content/test.ogv";
});
</script>
